import React,{Component} from "react";
import {connect} from "react-redux"
import {WhiteSpace,Card,Button,WingBlank,Modal} from "antd-mobile";
import Cookie from 'js-cookie'

import {resetUser} from '../../redux/actions'
import './personal.css'
class Personal extends Component{

    Onclick=()=>{
        Modal.alert('退出登录',null, [
            { text: '确认', onPress: () => {
                //确认退出之后跳转到登录界面，干掉cookie,重置store数据
                    Cookie.remove("userid")
                    this.props.resetUser()
                } },
            { text: '取消' },
        ])
    }
    render(){
        const {header,username,company,info,post,salary,type} = this.props
        console.log(username+"的props是",this.props)
        let companyandname
        if (type==="老板"){
             companyandname = "公司："+company
        }
        return(
            <div>
                <WingBlank>
                <Card>
                    <Card.Header
                        title={username}
                        thumb={require("../../assets/headers/"+header+".png")}
                        extra={<span>{post}</span>}
                    />
                    <Card.Body>
                        <div className="info">{info}</div>
                    </Card.Body>
                    {
                     type==="老板"? <Card.Footer content={companyandname} extra={<div>工资：{salary}</div>} />:null
                    }
                </Card>
                    <WhiteSpace></WhiteSpace>
                    <Button type={"warning"} onClick={this.Onclick}>退出登录</Button>
            </WingBlank>

                {/*<Result
                    img={<img src={require("../../assets/headers/"+header+".png")} alt=""/>}
                    title={username}
                    //当然大神是没有公司的，所以这个就是undefined
                    message={<div>{company} </div>}
                />*/}

            </div>
        )
    }
}
export default connect(
    state=>state.user,
    {resetUser}
)(Personal)